import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import moment from 'moment';
import numeral from 'numeral';
import {
  Row,
  Col,
  Card,
  Form,
  Input,
  Select,
  Icon,
  Button,
  Dropdown,
  Menu,
  InputNumber,
  DatePicker,
  Modal,
  message,
  Badge,
  Divider,
  Tabs,
  Table,
  Tooltip,
  Spin,
} from 'antd';
import PageHeaderLayout from '../../layouts/PageHeaderLayout';
import DescriptionList from 'components/DescriptionList';

import styles from './LoanStatistic.less';
const TabPane = Tabs.TabPane;
const FormItem = Form.Item;
const { Option } = Select;
const { Description } = DescriptionList;

const formatWan = val => {
  const v = val * 1;
  if (!v || isNaN(v)) return '';

  let result = val;
  if (val > 10000) {
    result = Math.floor(val / 10000);
    result = (
      <span>
        {result}
        <em className={styles.wan}>万</em>
      </span>
    );
  }
  return result;
};

@connect(({ loanStatistics, loading }) => ({
  loanStatistics,
  loading: loading.models.loanStatistics,
}))
@Form.create()
export default class LoanStatistics extends PureComponent {
  state = {


  };
  componentDidMount() {
    const { dispatch } = this.props;
    dispatch({
      type: 'loanStatistics/fetchTodayStatCountForXBeauty',
    });
  }




  render() {
    const { loanStatistics: { todayData }, loading} = this.props;

    return (
      <PageHeaderLayout title="今日统计">
        {
          !loading && todayData ?
            <div>
              <Card title="今日数据"  bordered={false} style={{margin: '20px 0'}}>
                <Card.Grid  style={{width:'100%',textAlign:'center'}}>
                  <Description term="当日注册量">{todayData.registerNum ?todayData.registerNum: 0}</Description>
                </Card.Grid>
                <Card.Grid  style={{width:'50%',textAlign:'center'}}>
                  <DescriptionList size="small"  style={{marginBottom:20}} title="" col="2" layout="vertical">
                    <Description term="还款笔数">{todayData.repayNum? todayData.repayNum: 0}</Description>
                    <Description term="还款金额">{todayData.repayAmount? todayData.repayAmount: 0}</Description>
                  </DescriptionList>
                </Card.Grid>
                <Card.Grid  style={{width:'50%',textAlign:'center'}}>
                  <DescriptionList size="small" style={{marginBottom:20}} title="" col="2" layout="vertical">
                    <Description term="放款笔数">{todayData.lendNum? todayData.lendNum : 0}</Description>
                    <Description term="放款金额">{todayData.lendAmount? todayData.lendAmount: 0}</Description>
                  </DescriptionList>
                </Card.Grid>

                <Card.Grid   style={{textAlign:'center'}}>
                  <Description term="借贷申请订单个数:">{todayData.applyNum ? todayData.applyNum: 0}</Description>
                  <DescriptionList size="small" style={{marginTop:20}}  title="" col="2" layout="vertical">
                    <Description term="新增申请数">{todayData.newApplyNum? todayData.newApplyNum: 0}</Description>
                    <Description term="复贷申请数">{todayData.oldApplyNum? todayData.oldApplyNum: 0}</Description>
                  </DescriptionList>
                </Card.Grid>
                <Card.Grid style={{textAlign:'center'}}>
                  <Description term="通过个数">{todayData.passNum? todayData.passNum: 0}</Description>
                  <DescriptionList size="small" style={{marginTop:20}} title="" col="2" layout="vertical">
                    <Description term="新增通过数">{todayData.newPassNum? todayData.newPassNum: 0}</Description>
                    <Description term="复贷通过数">{todayData.oldPassNum? todayData.oldPassNum: 0}</Description>
                  </DescriptionList>
                </Card.Grid>
                <Card.Grid style={{textAlign:'center'}}>
                  <Description term="通过率">{todayData.passRate? todayData.passRate: 0}</Description>
                  <DescriptionList size="small" style={{marginTop:20}}  title="" col="2" layout="vertical">
                    <Description term="新增通过率">{todayData.newPassRate? todayData.newPassRate: 0}</Description>
                    <Description term="复贷申请率">{todayData.reLoanRate? todayData.reLoanRate: 0}</Description>
                  </DescriptionList>
                </Card.Grid>
              </Card>
              <div style={{overflow:'hidden'}}>
                <Card title="未来到期订单"  bordered={false} style={{width: '58%',float:'left',marginRight:20,textAlign:'center'}}>
                  <Card.Grid style={{width: '33%'}}>
                    <Description term="	未来到期笔数">{todayData.featureLoanEndNum}</Description>
                  </Card.Grid>
                  <Card.Grid style={{width: '33%'}}>
                    <Description term="	未来到期金额">{todayData.featureLoanEndItemAmount}</Description>
                  </Card.Grid>
                  <Card.Grid style={{width: '33%'}}>
                    <Description term="	未来到期利息">{todayData.featureLoanEndInterestAmount}</Description>
                  </Card.Grid>
                </Card>
                <Card title="合计数据"  bordered={false} style={{width: '40%',float:'left',textAlign:'center'}}>
                  <Card.Grid style={{width: '50%'}}>
                    <Description term="	历史放款总笔数">{todayData.totalLendNum}</Description>
                  </Card.Grid>
                  <Card.Grid style={{width: '50%'}}>
                    <Description term="	历史还款笔数">{todayData.totalRepayNum}</Description>
                  </Card.Grid>

                </Card>
              </div>
            </div>
            : <Spin />
        }
      </PageHeaderLayout>
    );
  }
}
